<!--  -->
<template>
  <div class="nav">
    <el-col :span="24">
      <el-menu
        :default-active="activeIndex"
        class="el-menu-vertical-demo"
        @open="handleOpen"
        @close="handleClose"
        background-color="#545c64"
        text-color="#fff"
        active-text-color="#ffd04b"
      >
        <el-submenu index="1" v-if="is_superuser">
          <template slot="title">
            <i class="el-icon-s-tools"></i>
            <span>管理员</span>
          </template>
          <el-menu-item index="1-0" @click="routerLink('/indexTab')">综合绩效首页</el-menu-item>
          <el-menu-item index="1-1" @click="routerLink('/index')">录入项目信息</el-menu-item>
          <el-menu-item index="1-2" @click="routerLink('/user')">录入用户信息</el-menu-item>
          <!-- <el-menu-item index="1-2" @click="routerLink('/user')">用户管理</el-menu-item> -->
        </el-submenu>
        <el-submenu index="2" v-if="is_admin">
          <template slot="title">
            <i class="el-icon-s-custom"></i>
            <span>项目负责人</span>
          </template>
          <el-menu-item index="2-0" @click="routerLink('/leadIndex')">个人绩效首页</el-menu-item>
          <el-menu-item index="2-1" @click="routerLink('/performance')">录入当年到款</el-menu-item>
          <el-menu-item index="2-2" @click="routerLink('/achievement')">录入新签合同</el-menu-item>
          <el-menu-item index="2-3" @click="routerLink('/argument')">录入论证编制</el-menu-item>
          <el-menu-item index="3-1" @click="routerLink('/user/personal')">录入公共服务</el-menu-item>
          <el-menu-item index="3-2" @click="routerLink('/user/personal2')">录入科研成果</el-menu-item>
        </el-submenu>

        <el-submenu index="3" v-if="is_commomuser">
          <template slot="title">
            <i class="el-icon-user"></i>
            <span>普通用户</span>
          </template>
          <el-menu-item index="3-0" @click="routerLink('/user/project')">个人绩效首页</el-menu-item>
          <el-menu-item index="3-1" @click="routerLink('/user/personal')">录入公共服务</el-menu-item>
          <el-menu-item index="3-2" @click="routerLink('/user/personal2')">录入科研成果</el-menu-item>
        </el-submenu>
      </el-menu>
    </el-col>
  </div>
</template>

<script>
  export default {
    components: {},
    data() {
      return {
        activeIndex: "1-1",
        is_admin:false,
        is_superuser:false,
        is_commomuser:false,
        navArr: {
          indexTab: "1-0",
          index: "1-1",
          user: "1-2",
          leadIndex: '2-0',
          performance: '2-1',
          achievement: '2-2',
          argument: "2-3",
          user_project: '3-0',
          user_personal: '3-1',
          user_personal2:'3-2'
        }
      };
    },
    computed: {},
    created() {
      //钩子函数created() 页面加载之前执行的方法
      var pathName = this.$route.name; //获取一下路径里面的name
      this.activeIndex = this.navArr[pathName]; //通过获取路由里面的name，匹配这个name在navArr的值，设置activeIndex，activeIndex是这个导航被选中的项的index
      var data = JSON.parse(sessionStorage.getItem("userInfo"));
      if(data.data.is_superuser){
        this.is_superuser = true;
        }else if(data.data.is_admin){
          this.is_admin = true;
        }
        if(!data.data.is_superuser && !data.data.is_admin ){
          this.is_commomuser = true;
        }
    },
    mounted() {
      //钩子函数mounted（） 页面加载完后执行的方法
    },
    watch: {},
    methods: {
      handleOpen(key, keyPath) {
        console.log(key, keyPath);
      },
      handleClose(key, keyPath) {
        console.log(key, keyPath);
      },
      routerLink(url) {
        this.$router.push(url);
      }
    }
  };
</script>
<style scoped>
  .nav {
    background: rgb(84, 92, 100);
    overflow: hidden;
    height: 100%;
  }

  .el-menu {
    border: 0;
  }
</style>
